import { createRouter, createWebHashHistory } from "vue-router";
//import Home from '../pages/Home.vue'
//import Posts from '../pages/Posts.vue'
//import archive from '../pages/Archive.vue'

const router = createRouter({
    history: createWebHashHistory(),
    routes: [

        // 推荐按需加载方式
        { path: "/", redirect: "/archive" },
        { path: "/home", component: () => import("../pages/Home.vue") },
        { path: "/posts", component: () => import("../pages/Posts.vue") },
        {
            path: "/archive",
            component: () => import("../pages/Archive.vue"),
            children: [
                {
                     path: 'a', component: ()=> import('../pages/ArchiveA.vue')
                },
                {
                     path: 'b', component: ()=> import('../pages/ArchiveB.vue')
                }
            ]
        },

        // 不推荐
        // { path: '/home', component: Home },
        // { path: '/posts', component: Posts },
        //{ path: '/archive', component: archive },
    ],
});

export const age = 19

export default router;

// 1、创建vue项目： yarn create vite code --template vue
// 2、安装vue-router: yarn add vue-router
// 3、创建vue-router的配置文件，定义路由：   src/router/index.js
// 4、配置到vue项目中。在main.js中，使用use方法
// 5、在模板中使用：  router-link 和  router-view组件
// 另外：定义router激活时的样式